<template>
  <div>
    <h1 align="center">优惠券列表</h1>
    <input type="button" value="添加优惠券" @click="tiao" />
    <table class="table table-bordered">
      <tr>
        <td>类型券</td>
        <td>拥有时间</td>
        <td>使用日期</td>
        <td>状态</td>
        <td>库存量</td>
        <td>操作</td>
      </tr>
      <tr v-for="item in list">
        <td>{{ item.k_name }}</td>
        <td>{{ item.y_date.substr(0, 10) }}</td>
        <td>{{ item.y_jdate.substr(0, 10) }}</td>
        <td>{{ item.y_sate == 1 ? '上架' : '下架' }}</td>
        <td>{{ item.y_number }}</td>
        <td>
          <input type="button" value="注销" @click="zhu(item.id_Id,item.y_sate)" />
        </td>
      </tr>
    </table>
    <div>
      <span
        >总页数:<b style="color: red">{{ totalPage }}</b></span
      >
      <span
        >总条数:<b style="color: red">{{ totalCount }}</b></span
      >
      <span
        >当前:<b style="color: red">{{ state.PageIndex }}/{{ totalPage }}</b
        >页</span
      >
      <input type="button" value="首页" @click="goPage('home')" />
      <input type="button" value="上一页" @click="goPage('prve')" />
      <input type="button" value="下一页" @click="goPage('next')" />
      <input type="button" value="尾页" @click="goPage('end')" />
    </div>
  </div>
</template>
<script setup lang="ts">
import { reactive, toRefs, onMounted } from 'vue';
import axios from 'axios';
import { useRouter, useRoute } from 'vue-router';
const router = useRouter();
const route = useRoute();
let data: any = reactive({
  state: {
    PageIndex: 1,
    PageSize: 4
  },
  list: [],
  totalPage: 0,
  totalCount: 0
});
let { state, list, totalPage, totalCount } = toRefs(data);

const goPage = (str: any) => {
  switch (str) {
    case 'home':
      if (state.value.PageIndex == 1) {
        alert('已经首页了');
        state.value.PageIndex = 1;
        return;
      }
      state.value.PageIndex = 1;
      break;
    case 'prve':
      if (state.value.PageIndex == 1) {
        alert('已经不能上一页');
        // state.value.PageIndex--;
        return;
      }
      state.value.PageIndex--;
      break;
    case 'next':
      if (state.value.PageIndex == data.totalPage) {
        alert('已经不能下一页');
        // state.value.PageIndex++;
        return;
      }
      state.value.PageIndex++;
      break;
    case 'end':
      if (state.value.PageIndex == data.totalPage) {
        alert('已经尾页了');
        state.value.PageIndex = data.totalPage;
        return;
      }
      state.value.PageIndex = data.totalPage;
      break;
  }
  Show();
};

//添加优惠券
const tiao = () => {
  router.push('/Radd');
};
onMounted(() => {
  Show();
});
const Show = () => {
  let obj = {
    PageIndex: state.value.PageIndex,
    PageSize: state.value.PageSize
  };
  axios({
    url: '/api/JIuidan/YShow',
    method: 'get',
    params: obj
  })
    .then((res) => {
      console.log(res);
      list.value = res.data.data;
      totalPage.value = res.data.totalPage;
      totalCount.value = res.data.totalCount;
    })
    .catch((err) => {
      console.log(err);
    });
};
const zhu = (id_Id: any, y_sate: any) => {
  if (y_sate==1) {
    y_sate=0
  }
  let obj = {
    id: id_Id,
    sate:y_sate
  };
  axios({
    url: '/api/JIuidan/Delluo',
    method: 'get',
    params: obj
  })
  .then(res=>{
    console.log(res)
    if (res.data.data==1) {
      Show();
    }
  })
  .catch(err=>{
    console.log(err)
  })
};
</script>

<style scoped></style>
